<template>
    <div class="check-details">
        <div class="user-mess">
        	<div class="cell-img"><div class="user"><img src="./../../../assets/images/user2.png" /></div></div>
            <div class="cell-text">
               <div class="user-name">
                   <div class="name">全自动量子点荧光免疫分析仪QD-S1200</div>
                   <div class="btnns">
                       <el-button type="primary">编辑</el-button>
                       <el-button>上一个</el-button>
                       <el-button>下一个</el-button>
                   </div>
               </div>
               <div class="other-texts">
                   <div class="list gray">质控编码：jy-0001</div>
                   <div class="list gray">仪器编码：100202108010078</div>
                   <div class="list gray">负责人：4898902</div>
                   <div class="list gray">检验项目：4898902</div>
               </div><!--other-texts 信息列表-可单独使用--->
               <div class="other-texts column-4 margin-top-15">
                   <div class="list"><span class="gray">质控品编号：</span>66岁</div>
                   <div class="list"><span class="gray">质控品批号：</span>女</div>
                   <div class="list"><span class="gray">质控品名称：</span>普通外科</div>
                   <div class="list"><span class="gray">试剂名称：</span>张慧玉</div>
                   <div class="list"><span class="gray">试剂编号：</span><span class="blue-primary">全自动量子点荧仪</span></div>
                   <div class="list"><span class="gray">试剂批号：</span>yq-0001</div>
                   <div class="list"><span class="gray">统计时间：</span>刘备</div>
                   <div class="list"><span class="gray">检验者：</span>肾功能检测</div>
                   <div class="list"><span class="gray">质控品靶值±SD：</span>水平1：</div>
                   <div class="list"><span class="gray"></span>水平2：</div>
                   <div class="list"><span class="gray"></span>水平3：</div>
               </div><!--other-texts 信息列表-可单独使用--->
            </div>
        </div><!------user-mess 用户信息------>
        <div class="gray-card">
            <div class="card-head">
                <div class="cell-title">质控图型</div>
                <div class="cell-btn"><el-button round>编辑</el-button><el-button round>刷新</el-button></div>
            </div>
            <div class="card-body">
                
            <EchartsForm name='top' />
            <EchartsForm name='top2' />
            <EchartsForm name='top3' />
            
            </div>
           
        </div><!------gray-card 灰色卡片-可以单独使用------>
        <div class="gray-card">
            <div class="card-head">
                <div class="cell-title">质控表格</div>
                <div class="cell-btn"><el-button round>编辑</el-button><el-button round>刷新</el-button></div>
            </div>
            <div class="card-body">
                
            <el-row class="quailtybox">
                <el-col span="2">
                    <div>日期</div>
                    <div>浓度高</div>
                    <div>浓度中</div>
                    <div>浓度低</div>
                    <div>日期</div>
                    <div>浓度高</div>
                    <div>浓度中</div>
                    <div>浓度低</div>
                    <div>日期</div>
                    <div>浓度高</div>
                    <div>浓度中</div>
                    <div>浓度低</div>
                </el-col>
                <el-col span="2" v-for="item in qualityData" :key='item.index' > 
                    <div>{{item.date}}</div>
                    <div>{{item.low}}</div>
                    <div>{{item.middle}}</div>
                    <div>{{item.high}}</div>
                </el-col>
                
            </el-row>
            <h2>质控表格</h2>
            
            </div>
            
        </div><!------gray-card 灰色卡片-可以单独使用------>

        <div class="details-foot">
            <div class="cell-text">
                <p class="title">危急值报警：<span class="red">RBP</span></p>
                <p class="text">检验项目中发现有危急值项，建议立即发起危急值处理流程</p>
            </div>
            <div class="cell-btn"><el-button type="danger">发送危急值处理申请</el-button></div>
        </div><!------details-foot 底部预警------>
        <el-card class="box-card danger-card">
            <p class="wanr-title">危急值报警：<span class="red">RBP</span></p>
            <div class="other-texts inline-list">
               <div class="list">报告人：张欣慧</div>
               <div class="list">  报告时间：2021/09/08  12:00</div>
            </div><!--other-texts 信息列表-可单独使用--->
        </el-card><!------el-card danger-card 预警卡片 -->

        <div class="details-foot">
            <div class="cell-text">
                <p class="title">危急值报警：<span class="red">RBP</span></p>
                <p class="text">检验项目中发现有危急值项，建议立即发起危急值处理流程</p>
            </div>
            <div class="cell-btn">
                <el-button type="primary">确定</el-button>
                <el-button>取消</el-button>
                <el-button type="danger">发送危急值处理申请</el-button>
            </div>
        </div><!------details-foot 底部预警------>
        <el-card class="box-card gray-card">
          <div slot="header" class="clearfix">
            <span>卡片名称</span>
            <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button>
          </div>
          <el-form ref="form"  label-width="100px">
              <el-form-item label="原因分析：">
                <el-input type="textarea" style=" width:650px; height:100px;"></el-input>
              </el-form-item>
              <el-form-item label="流转审批：">
                <el-input type="textarea" style=" width:650px; height:100px;"></el-input>
              </el-form-item>
              <el-form-item label="流转意见：">
                <el-input type="textarea" style=" width:650px; height:100px;"></el-input>
              </el-form-item>
              <el-form-item label="下一步环节：">
                <el-select placeholder="请选择下一步环节">
                  <el-option label="环节一" value="shanghai"></el-option>
                  <el-option label="环节二" value="beijing"></el-option>
                </el-select>
              </el-form-item>
          </el-form>
        </el-card><!------el-card gray-card 灰色卡片------>
    </div>
</template>

<script>
import EchartsForm from '../../../components/echartsForm/index.vue'

export default {
  name: "qualityDetail",
  components: {  EchartsForm},
  data() {
    return {
      deviceList: [],
      loading: false,
      redirect: undefined,
      registerShow:false,
      checkList:[],
      qualityData:[],
      form: {
          dNo: '',
          dname: '',
          dpno: '',
          pro: '',
          sample: '',
          dep: [],
          mainMan: '',
          manager: '',
          date: '',
          factory: '',
          desc: '',
          func: '',
          dimg: '',
          dapp: '',
        }
    };
  },
  watch: {
    
  },
  created() {
      this.getDeviceList()
      this.getCheckList()
      this.getQualityData()
  },
  methods: {
      getQualityData(){
          let data ={
              date: '2021/8/1',
              low:'24.25',
              middle:'25.09',
              high:'25.09'
          }
          for(let i=0;i<31;i++){
            this.qualityData.push(data)
        }
      },
    toBack(){
        this.$emit('func',false)
    },
    getCheckList(){
        let check ={
            checkNo:'JY-0001',
            name:'孙悟空',
            checkName:'血红蛋白',
            checkTime:'2021/02/01 12:00',
            checkResult:'正常',
            isReport:'待生成'
        } 
        for(let i=0;i<5;i++){
            this.checkList.push(check)
        }
    },
    getDeviceList(){
        let deviceExp ={
            name:'全自动量子点荧光免疫分析仪QD-S1200',
            deviceNo:'NJYKD-JY-XT-000006',
            dep:'心脑血管科',
            connet:true,
            warning:false,
            lock:false,
            wait2Check:true
        }
        for(let i=0;i<25;i++){
            this.deviceList.push(deviceExp)
        }
    },
    toDeviceInfo(id){
        this.$router.push({path:"/device/deviceInfo/index"});
    }
  }
};
</script>